<script setup lang="ts">
import {ref} from "vue";
import type {Museum, PageMuseumReqVO} from "@/interfaces/museum";
import {useStore} from "vuex";
import {usePageMuseumsApi} from "@/services/api";
import {onLoad, onShow} from "@dcloudio/uni-app";

const uToastRef = ref()
const store = useStore()
const notice = ref<string>('暂无通知')
const list = ref<string[]>([
  '/static/1.jpg',
  '/static/2.jpg',
  '/static/3.webp'
])
const pageMuseumReq = ref<PageMuseumReqVO>({
  current: 1,
  size: 10
})
const museumList = ref<Museum[]>([])
const search = (key: string) => {
  uni.$u.route({
    url:'/pages/search/search',
    params:{
      key
    }
  })
}
const init = async () => {
  const {data: res} = await usePageMuseumsApi(pageMuseumReq.value)
  museumList.value = res.list
}
onShow(() => {
  init()
})
onLoad(() => {
  init()
})
</script>

<template>
  <view class="container">
    <u-toast ref="uToastRef"></u-toast>
    <custom-search @search="search"></custom-search>
    <custom-swiper :list="list"></custom-swiper>
    <u-notice-bar :text="notice" fontSize="24"></u-notice-bar>
    <custom-museum-list :is-show-first="true" :museum-list="museumList"></custom-museum-list>
    <view style="margin-bottom: 50px"></view>
    <custom-tabbar></custom-tabbar>
  </view>
</template>

<style scoped lang="scss">
.container {
  width: 100vw;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
</style>